<template>
  <div class="list">
    <div
      class="Box"
      v-for="(data, index) in glassData"
      :key="data.id"
      :style="{ paddingBottom: index == glassData.length - 1 ? '20px' : '0' }"
    >
      <div v-if="data.optCodeContext != codeContext">
        <el-divider>{{ index + 1 }} </el-divider>
        <div class="item">
          <div class="title">玻璃ID</div>
          <div class="value">
            {{ data.id }}
          </div>
        </div>
        <div class="item">
          <div class="title">尺寸</div>
          <div class="value">{{ data.width }}mm * {{ data.height }}mm</div>
        </div>
        <div class="item">
          <div class="title">玻璃类型</div>
          <div class="value">{{ data.type }}</div>
        </div>
        <div class="item">
          <div class="title">笼号</div>
          <div class="value">{{ data.gridGroup }}</div>
        </div>
        <div class="item">
          <div class="title">格号</div>
          <div class="value">{{ data.grid }}</div>
        </div>
        <div class="item">
          <div class="title">识别码</div>
          <div class="value">
            {{ data.optCodeContext }}
          </div>
        </div>
        <div class="item">
          <div class="title">位置</div>
          <div
            class="value"
            @click="handlerGoToSignal()"
            :style="{ textDecoration: 'underline', color: 'blue' }"
          >
            <dict-tag
              :options="dict.type.quartz_common_location"
              :value="data.place"
            />
          </div>
        </div>
        <div class="item">
          <div class="title">完成时间</div>
          <div class="value">{{ data.updateTime }}</div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { getGlassListPDA } from "@/api/production/pda";
export default {
  dicts: [
    "quartz_glass_state",
    "quartz_common_location_search",
    "quartz_common_location",
  ],
  data() {
    return {
      glassData: [],
      codeContext: null,
      place: null,
    };
  },
  methods: {
    getPlaceGlassByCode() {
      getGlassListPDA({ codeContext: this.codeContext }).then((res) => {
        this.glassData = res.data;
      });
    },
    handlerGoToSignal() {
      this.$router.push({ name: "Signal", query: { place: this.place } });
    },
  },
  mounted() {
    this.codeContext = this.$route.query.optCodeContext;
    this.place = this.$route.query.place;
    this.getPlaceGlassByCode();
  },
  computed: {},
};
</script>

<style lang="less" scoped>
/deep/.app-main {
  padding-bottom: 20px !important;
}
.list {
  width: 100%;
  height: 98%;
  padding: 0 10px;
  .Box {
    display: flex;
    flex-direction: column;
    .item {
      display: flex;
      margin-bottom: 5px;
      .title {
        font-size: 14px;
      }
      .value {
        margin-left: auto;
      }
    }
  }
}
</style>